<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta content="width=device-width, initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=0" name="viewport">
	<title>简历</title>
	 <!--<link rel="stylesheet" href="src/css/swiper.min.css">
	<link rel="stylesheet" href="src/css/animate.min.css"/>
	<link rel="stylesheet" href="src/css/index.css"> -->
	</head>
<body>
	<header id="header"></header>
	<section id="section">
		<nav class="navbar">
			<div class="name">Dong Lee</div>
			<div class="nav">
				<ul>
					<li>Tel:135-2555-3487</li>
					<!-- <li>Email:757729134@qq.com</li> -->
				</ul>
			</div>
		</nav>
		<div class="swiper-container con1">
			<div class="swiper-wrapper">
				<!----------------------------page 1-------------------------------->
				<div class="swiper-slide slide1">
					<div class="corner corner1 ani" swiper-animate-effect="rotateInDownLeft" swiper-animate-duration="1s">
						<img src="src/imgs/1.png" alt="">
					</div>
					<div class="corner corner2 ani" swiper-animate-effect="rotateInDownRight" swiper-animate-duration="1s">
						<img src="src/imgs/3.png" alt="">
					</div>
					<div class="corner corner3 ani" swiper-animate-effect="rotateInDownLeft" swiper-animate-duration="1s">
						<img src="src/imgs/2.png" alt="">
					</div>
					<div class="corner corner4 ani" swiper-animate-effect="rotateInDownRight" swiper-animate-duration="1s">
						<img src="src/imgs/4.png" alt="">
					</div>
					<div class="pic">
						<img  src="src/imgs/pic02.jpg">
					</div>
					<div class="resume">
						<span class="resume-name ani" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="2s">前端工程师</span><br>
						<span class="resume-chatc ani" swiper-animate-effect="zoomIn" swiper-animate-duration="2s" swiper-animate-delay="2s">爱生活 爱技术</span>
					</div>
					<div class="basic-info ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="3s">
						<p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="4s">李 东</p>
						<p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="5s">河南 信阳</p>
						<p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="6s">中原工学院</p>
						<p class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="7s">本科</p>
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="8s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!----------------------------page 2-------------------------------->
				<div class="swiper-slide slide2">
					<div class="work-exp ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span class="ani">工作经历/Work-Experience</span>
					</div>
					<div class="work-exps">
						<p class="work-exp1"><img class="point ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s" swiper-animate-delay="2s"/><span class="date ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="3s">xxxx年xx月-xxxx年xx月</span><span class="company ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="4s">某某公司担任某某职位</span><span class="work-con ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="1s" swiper-animate-delay="5s">	
                        	主要负责公司微信公众号日常运营，通过数据分析市场需求，以完善产品体验</span></p>
						<p class="work-exp2"><img class="point ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s" swiper-animate-delay="6s"/><span class="date ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="7s">xxxx年xx月-xxxx年xx月</span><span class="company ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="8s">某某公司担任某某职位</span><span class="work-con ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="1s" swiper-animate-delay="9s">	
                        	主要负责公司微信公众号日常运营，通过数据分析市场需求，以完善产品体验</span></p>
<!-- 						<p class="work-exp3"><img class="point ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s" swiper-animate-delay="8s"/><span class="date ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="9s">xxxx年xx月-xxxx年xx月</span><span class="company ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="10s">某某公司担任某某职位</span></p>
 -->						<!--<p class="work-exp4"><span class="date ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="12s">xxxx年xx月-xxxx年xx月</span><img class="point ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s" swiper-animate-delay="11s"/><span class="company ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="13s" >某某公司担任某某职位</span></p>
						<p class="work-exp5"><span class="date ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s" swiper-animate-delay="15s">xxxx年xx月-xxxx年xx月</span><img class="point ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s" swiper-animate-delay="13s"/><span class="company ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s" swiper-animate-delay="16s">某某公司担任某某职位</span></p>-->
						<img class="v-line ani" src="src/imgs/7.png" alt="" swiper-animate-effect="fadeInDown" swiper-animate-duration="1s" swiper-animate-delay="1s" />
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="10s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!----------------------------page 3-------------------------------->
				<div class="swiper-slide slide3">
					<div class="works-show ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span>作品展示/Works-Show</span>
					</div>
					<div class="works-show-con ani" >
						<div class="pc container">
							<span class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s"  swiper-animate-delay="3s">PC端</span>
							<img class="item ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s"  swiper-animate-delay="2s">
							<div class="img-con ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s"  swiper-animate-delay="4s">
								<img class="pc-pic" src="src/imgs/meici.jpg" alt="">
							</div>
							
						</div>
						<div class="mobile container">
							<span class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="1s"  swiper-animate-delay="6s">移动端</span>
							<img class="item ani" src="src/imgs/8.png" alt="" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s"  swiper-animate-delay="5s">
							<div class="img-con ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s"  swiper-animate-delay="7s">
								<img class="m-pic" src="src/imgs/resume.jpg" alt="">
							</div>
							
						</div>
						<img src="src/imgs/7.png" alt="" class="v-line ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s"  swiper-animate-delay="1s" >
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="8s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!--------------------------page 4---------------------->
				<div class="swiper-slide slide4">
					<div class="works-skill ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span>工作技能/Work-Skill</span>
					</div>
					<div class="skill-item">
						<span class="skill-item1 ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="1s">Js</span>
						<span class="skill-item2 ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="3s">Sublime</span>
						<span class="skill-item3 ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="5s">H5</span>
						<span class="skill-item4 ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="7s">Css3</span>
						<span class="skill-item5 ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="9s">webpack</span>
						<span class="skill-rule1 ani">100%</span>
						<span class="skill-rule2 ani">50%</span>
						<div class="skill-axis">
							<img src="src/imgs/10.png" alt="">
						</div>
						<img src="src/imgs/11.png" alt="" class="skill-value value1 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="2s">
						<img src="src/imgs/11.png" alt="" class="skill-value value2 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="4s">
						<img src="src/imgs/11.png" alt="" class="skill-value value3 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="6s">
						<img src="src/imgs/11.png" alt="" class="skill-value value4 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="8s">
						<img src="src/imgs/11.png" alt="" class="skill-value value5 ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="10s">
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="11s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!--------------------------page 5---------------------->
				<div class="swiper-slide slide5">
					<div class="edu-experience ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span>教育经历/Edu-Experience</span>
					</div>
					<div class="edu-expes ani" >
						<div class="edu-expe1 ani" swiper-animate-effect="bounceInLeft" swiper-animate-duration="1s"  swiper-animate-delay="2s">
							<p class="date">2008.9-2012.7</p>
							<p class="org">中原工学院<br>机械设计制造及其自动化专业</p>
						</div>
						<div class="edu-expe2 ani" swiper-animate-effect="bounceInRight" swiper-animate-duration="1s"  swiper-animate-delay="3s">
							<p class="date">2004.9-2008.6</p>
							<p class="org">河南省光山县第二高级中学</p>
						</div>
					</div>
					<div class="pic ani" swiper-animate-effect="flipInX" swiper-animate-duration="1s"  swiper-animate-delay="1s">
						<img src="src/imgs/12.jpg">
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="4s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!--------------------------page 6---------------------->
				<div class="swiper-slide slide6">
					<div class="self-assessment ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span>自我评价/Self-Assessment</span>
					</div>
					<div class="pic-bom ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="1s">
						<img src="src/imgs/16.png" alt="">
					</div>
					<div class="pic-mid ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="2s">
						<img src="src/imgs/14.png" alt="">
					</div>
					<div class="pic-flower ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="3s">
						<img src="src/imgs/17.png" alt="">
					</div>
					<div class="container zi">
						<img src="src/imgs/18.png" alt="" class="ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s"  swiper-animate-delay="4s">
						<p class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="4s">自</p>
					</div>
					<div class="container wo">
						<img src="src/imgs/18.png" alt="" class="ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s"  swiper-animate-delay="5s">
						<p class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="5s">我</p>
					</div>
					<div class="container ping">
						<img src="src/imgs/18.png" alt="" class="ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s"  swiper-animate-delay="6s">
						<p class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="6s">评</p>
					</div>
					<div class="container lun">
						<img src="src/imgs/18.png" alt="" class="ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s"  swiper-animate-delay="7s">
						<p class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="7s">价</p>
					</div>
					<div class="v-line line1 ani" swiper-animate-effect="fadeInDownBig" swiper-animate-duration="1s"  swiper-animate-delay="8s">
						<img src="src/imgs/19.png" alt="">
					</div>
					<div class="text-ass ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s"  swiper-animate-delay="9s">
						<p>做事认真负责，性格直爽，热爱学习。时间都去哪了这句话时刻提醒着自己，要努力，加油!</p>
					</div>
					<div class="cloud-pic cloud1 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s"  swiper-animate-delay="10s">
						<img src="src/imgs/20.png" alt="">
					</div>
					<div class="cloud-pic cloud2 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s"  swiper-animate-delay="10s">
						<img src="src/imgs/21.png" alt="">
					</div>
					<div class="cloud-pic cloud3 ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="1s"  swiper-animate-delay="10s">
						<img src="src/imgs/21.png" alt="">
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="11s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
				<!--------------------------page 7---------------------->
				<div class="swiper-slide slide7">
					<div class="contact-information ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s">
						<span>联系方式/Contact-Info</span>
					</div>
					<div class="iden-photo ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="1s">
						<img class="self-bg" src="src/imgs/circle.gif" alt="">
						<img class="self-pic" src="src/imgs/pic02.jpg" alt="">
					</div>
					<div class="con-english ani" swiper-animate-effect="zoomIn" swiper-animate-duration="1s" swiper-animate-delay="2s">
						<p class="word">PLEASE CONTACT ME!</p>
					</div>
					<div class="con-info">
						<div class="info-border ani" swiper-animate-effect="fadeInUpBig" swiper-animate-duration="1s" swiper-animate-delay="3s">
							<img class="" src="src/imgs/23.png" alt="">
						</div>
						<p class="con-title ani" swiper-animate-effect="zoomInUp" swiper-animate-duration="1s" swiper-animate-delay="3s">感谢您的阅读</p>
						<p class="con-QQ ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="4s">QQ:757729134</p>
						<p class="con-tel ani" swiper-animate-effect="fadeInUp" swiper-animate-duration="1s" swiper-animate-delay="5s">Tel:135-2555-3487</p>
						<p class="con-qrCode ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s" swiper-animate-delay="6s">
							<img src="src/imgs/qrCode.png" alt="">
						</p>
					</div>
					<div class="ani icon" swiper-animate-effect="fadeInUp" swiper-animate-duration="2s" swiper-animate-delay="7s" style="animation-iteration-count:infinite">
						<i class="ani iconfont">&#xe608;</i>
					</div>
				</div>
			</div>
		</div>
	</section>
	<footer id="footer"></footer>
</body>
 <!--<script src="src/js/swiper.min.js"></script>
<script src="src/js/swiper.animate.min.js"></script>
<script src="src/js/index.js"></script> -->
</html>